<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<c:choose>
	<c:when test="${not empty showDoingProduct }">
		<title>
			<c:if test="${not empty showDoingProduct.picThumb }">【图】</c:if>${showDoingProduct.name } – 果果街
		</title>
		<meta name="keywords" content="${doing.systemTag },果果街,果果网" />
		<meta name="description" content="<c:out value="${doing.content}" /> – 果果街网友@${doing.memberName }分享"/>
	</c:when>
	<c:otherwise>
		<title>
		<c:if test="${not empty showDoingPicture.pictureThumbnail }">【图】</c:if>${fn:substring(doing.content,0,20)}– 果果街</title>
		<meta name="keywords" content="果果,果果街,果果网,童装, 淘宝网童装,儿童服装,儿童礼物,儿童美食,母婴用品,童装搭配,创意家居,玩具图书,亲子早教 " />
		<meta name="description" content="<c:out value="${doing.content}" /> – 果果街网友@${doing.memberName }分享" />
	</c:otherwise>
</c:choose>

<%@include file="../common/jscss.jsp"%>

<script type="text/javascript" src="js/web2/joinPictorial.js"></script>
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/home.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
    $(function() {
        //加载评论
        $("#div_doing_comment").load("getDoingComment.htm?doingId=${doing.identifier}");
        //转发
        $("#post_forward").click(function() {
            GUOGUO.doingForwardDialog(this);
        });

    });
    //增加关注
    function addFollow() {
    	if(!GUOGUO.checkLogin()){
    		GUOGUO.memberLogin();
    	}else{
    		 var follow = "${family.doorplate}";
    	        $.post("addFollow.htm", {
    	            follow: follow
    	        },
    	        function(data) {
    	            if (data == 'success') {
    	                var $cancelFollow = $("#cancelFollow");
    	                if ($cancelFollow.length > 0) {
    	                    $cancelFollow.show();
    	                    $("#a_addFollow").hide();
    	                    $("#span_gz").show();
    	                } else {
    	                    $("#a_addFollow").hide().after('<span id="span_gz"><i class="gzed"> 已关注</i>  | <a class="cancel" href="javascript:void(0)" onclick="cancelFollow()">取消</a></span> ');
    	                }
    	            }
    	        });
    	}
    }
    //取消关注
    function cancelFollow() {
        var follow = "${family.doorplate}";
        $.post("cancelFollow.htm", {
            follow: follow
        },
        function(data) {
            if (data == 'success') {
                var $a_addFollow = $("#a_addFollow");
                if ($a_addFollow.length > 0) {
                    $a_addFollow.show();
                    $("#cancelFollow").hide();
                    $("#span_gz").hide();
                } else {
                    $("#cancelFollow").hide().after('<a id="a_addFollow" href="javascript:void(0)" onclick="addFollow();" class="addgz">+加关注</a>');
                }

            }
        });
    }
    //评论
    function commentDoing() {
    	if(!GUOGUO.checkLogin()){
    		GUOGUO.memberLogin();
    	}else{
    		 var doingId = "${doing.identifier}";
    	        var reply_comment_id = $("#reply_comment_id").val();
    	        var commentText = $("#commentText").val();
    	        if (commentText == "") {
    	            alert("请输入评论内容");
    	            return;
    	        }
    	        var commentCount = parseInt($("#comment_count").text());
    	        var isForward = document.getElementById("ck_forward").checked;
    	        $.post("addDoingComment.htm", {
    	            'commentId': doingId,
    	            'content': commentText,
    	            'commentIdType': "doingid",
    	            'toFamily': '${doing.owner}',
    	            'isForward': isForward,
    	            'replyCommentId': reply_comment_id
    	        },
    	        function(data) {
    	            $("#commentText").val("");
    	            $("#comment_count").text(commentCount + 1);
    	            $("#div_doing_comment").load("getDoingComment.htm?doingId=${doing.identifier}");
    	        });
    	}
       
    }

    //回复
    function replyMe(name, replyCommentId) {
        $("#reply_comment_id").val(replyCommentId);
        $("#commentText").val("回复@" + name + ":")
    }

    //评论
    function doingComment() {
        $("#div_doing_comment").load("getDoingComment.htm?doingId=${doing.identifier}");
    }

    //分享
    function showShare(id) {
        $("#share_" + id).toggle();
    }
</script>
</head>
<body>
<%@include file="../common/header.jsp"%>
	<div class="wraper">
		
		<div class="content">

			<div class="hweibo">
				<div class="sharedetail">
					<div class="title">
						<c:if test="${not empty showDoingProduct }">
							<h1>${showDoingProduct.name }</h1>
							<a href="${showDoingProduct.linkUrl }" class="btn_goumai" target="_bank">购买链接</a>
						</c:if>
					</div>
					<div class="detail">
						<c:if test="${not empty doing.doingProductList || not empty doing.doingPictureList }">
							<div class="detail_img" id="detail_img">
								<!-- 商品图 -->
								<c:if test="${not empty showDoingProduct && empty pictureId || not empty productId}">
									<div class="pic_b_bd">
										<a href="javascript:;" picType="2" picproId="${showDoingProduct.identifier}" style="right: 110px;top: 70px;" class="add_to_album_btn"></a>
										<a href="${showDoingProduct.linkUrl }" target="_bank" class="detail_price_a">
											<img src="${showDoingProduct.imageServer }${showDoingProduct.picThumb }_468xXXX.jpg" id="t" alt="${showDoingProduct.name }"/>
											<span><i>￥${showDoingProduct.price }</i><b></b></span>
										</a>
									</div>
									<div class="viewdiv">
										<a href="${showDoingProduct.imageServer }${showDoingProduct.picThumb }_468xXXX.jpg" class="view" target="_blank">查看原图</a>
									</div>
								</c:if>
								<!-- 微博图 -->
								<c:if test="${empty showDoingProduct && not empty showDoingPicture && empty pictureId || not empty pictureId}">
									<div class="pic_b_bd">
										<a href="javascript:;" picType="1" picproId="${showDoingPicture.identifier}" style="right: 110px;top: 70px;" class="add_to_album_btn"></a>
										<img src="${showDoingPicture.imageServer }${showDoingPicture.pictureThumbnail }_468xXXX.jpg" />
									</div>
									<div class="viewdiv">
										<a href="${showDoingPicture.imageServer }${showDoingPicture.pictureThumbnail }_468xXXX.jpg" class="view" target="_blank">查看原图</a>
									</div>
								</c:if>
							</div>
						</c:if>
						<div class="detail_con">
							<p>${doing.replaceContent }
								<i>
									<fmt:formatDate value="${doing.gmtCreated}" pattern="MM月dd日 HH:mm" />
								</i>
							</p>
							<c:if test="${not empty doing.tag }">
								<div class="tag">
									<b>标签：</b>
									<c:forEach items="${tagList }" var="tag">
										<a href="#">${tag }</a>
									</c:forEach>
								</div>
							</c:if>
						</div>
						<div class="glinkb">
						   <a class="link" href="javascript:void(0);" <c:if test="${member!=null }">onclick="GUOGUO.loveDoing('${doing.identifier}','${doing.owner }',this);"</c:if> 
						   <c:if test="${member==null }">onclick="GUOGUO.memberLogin();"</c:if>
						    >喜欢</a>
						   <span class="lovenum" style="float: left; border: solid 1px #F42481; color: #F42481; padding: 2px 5px 2px 5px; border-radius: 3px 3px 3px 3px; margin-left: 3px;" id="love_count">
						   		${doing.doingLoveCount }
						   </span>
						</div>
						<div class="clear"></div>
					</div>
					<div class="othershare" style="position: relative;">
						<div style="float: right">
							<a style="color: #6F980B;" href="javascript:void(0);" class="zsend" id="post_share" onclick="showShare('${doing.identifier}');">分享</a>
							<c:choose>
								<c:when test="${member!=null }">
									<a style="color: #6F980B;" href="javascript:void(0);" class="zsend" id="post_forward" doingId="${doing.identifier}">转发</a>
									
								</c:when>
								<c:otherwise>
									<a style="color: #6F980B;" href="javascript:void(0);" onclick="GUOGUO.memberLogin();" class="zsend">转发</a>
								</c:otherwise>
							</c:choose>
						</div>
						<div class="h6">
							<h6>相关分享</h6>
						</div>
						<div class="shareTanchu_y" id="share_${doing.identifier }" style="display: none; left: 513px; top: 20px">
							<a href="shareWeibo.htm?id=${doing.identifier }&shareType=01" target="_blank"><img src="imgs/loginPic1.png" alt="新浪" />新浪微博</a>
							<a href="shareWeibo.htm?id=${doing.identifier }&shareType=03" target="_blank"><img src="imgs/loginPic2.png" />腾讯微博</a>
						</div>
						<div class="h6con">
							<c:if test="${not empty doing.doingProductList }">
								<c:forEach items="${doing.doingProductList }" var="product">
									<c:if test="${product.identifier!=showDoingProduct.identifier }">
										<a href="dt.htm?pro=${product.identifier}">
											<img src="${product.imageServer }${product.picThumb }_200xXXX.jpg" alt="${product.name }"/>
										</a>
									</c:if>
								</c:forEach>
							</c:if>
							<c:if test="${not empty doing.doingPictureList}">
								<c:forEach items="${doing.doingPictureList }" var="pic">
									<c:if test="${showDoingPicture.identifier!=pic.identifier }">
										<a href="dt.htm?pic=${pic.identifier}">
											<img src="${pic.imageServer }${pic.pictureThumbnail }_200xXXX.jpg"/>
										</a>
									</c:if>
								</c:forEach>
							</c:if>
						</div>
						<div class="clear"></div>
					</div>
					<div class="clear"></div>
				</div>
				<!--/sharedetail-->
				<div class="comment_input">
					<input type="hidden" id="reply_comment_id" />
					<ul class="tab">
						<li class="current">
							评论<c:if test="${doing.commentCount!=0 }">(<font id="comment_count">${doing.commentCount }</font>)</c:if>
						</li>
					</ul>
					<div class="tabcon">
						<textarea title="输入框" rows="3" id="commentText"></textarea>
						<div class="weibobtn">
							<div id="div_forward">
								<input type="checkbox" id="ck_forward" /> 转给我的粉丝
								<input type="button" value="评论" class="sharebtn" onclick="commentDoing();" />
							</div>
						</div>
						<div class="blink">
							<a href="javascript:;">
								<input type="hidden" id="textareaId" value="commentText" />
							</a>
						</div>
						<!-- 表情 -->
						<%@include file="../common/expression.jsp"%>
						<div class="clear"></div>
					</div>
					<!--/tabcon-->
					<div class="clear"></div>
				</div>
				<div id="div_doing_comment"></div>
				<div class="clear"></div>
				<div class="alllike">
					<c:if test="${not empty otherLoveList }">
						<div class="h6">
							<h6>喜欢这个的人也喜欢</h6>
						</div>
						<div class="h6con clearfix">
						<c:forEach items="${otherLoveList }" var="pro">
							<a href="dt.htm?pro=${pro.identifier}">
								<img src="${pro.imageServer }${pro.picThumb }_100x100.jpg" alt="${pro.name }" title="${pro.name }"/> 
							</a>
						</c:forEach>
							<div class="clear"></div>
						</div>
					</c:if>
				</div>
				<div class="clear"></div>
				<em class="lt"></em><em class="lb"></em><em class="rt"></em><em class="rb"></em>
			</div>
			<!--hweibo-->
			<div class="hright">
				<div class="hrightspan family">
					<h5>
						<span class="h5">${family.nickname }</span>
					</h5>
					<ul>
						<c:forEach items="${memberList }" var="m">
							<c:if test="${m.role!='05' }">
								<li>
									<a href="cover.htm?fid=${m.family }">
										<img src="${m.imageServer }${m.avatar}" width="49" height="49" />
										<span>${m.nickname}</span>
									</a>
								</li>
							</c:if>
						</c:forEach>
					</ul>
					<c:if test="${member.family!=doing.owner }">
						<p class="gz">
							<c:if test="${isFollow==0 }">
							   <a id="a_addFollow" href="javascript:void(0)" onclick="addFollow();" class="addgz">+加关注</a>
							</c:if>
							<c:if test="${isFollow==1}">
								<span id="cancelFollow"><i class="gzed"> 已关注</i> | <a href="javascript:void(0)" onclick="cancelFollow()" class="cancel">取消</a> </span>
							</c:if>
						</p>
					</c:if>
					<div class="clear"></div>
				</div>
				<div class="hrightspan hudong">
					<ul>
						<li>关注<a href="follow.htm?family=${family.doorplate}">${family.followCount }</a>
						</li>
						<li>粉丝<a href="fans.htm?family=${family.doorplate}">${family.fansCount }</a>
						</li>
						<li>被喜欢<a href="javascript:;">${family.loveCount }</a>
						</li>
					</ul>

					<div class="clear"></div>
				</div>
				<div class="hrightspan info">
					<span class="h5"><h5>家的信息</h5><i><a href="javascript:;"></a></i></span>
					<p class="p">${family.introduction }</p>
					<p>
						<b>所在地：</b>${family.province }${family.city }${family.county}${family.town }<br />
					</p>
					<c:set var="isBaby" value="0" />
					<c:forEach items="${memberList }" var="b">

						<c:if test="${not empty b && b.role=='05' }">
							<c:set var="isBaby" value="${isBaby+1 }" />
							<c:if test="${isBaby==1 }">
								<b>宝宝：</b>
							</c:if>
							<a href="#" class="name">${b.username }</a> ${b.age }
								<c:if test="${b.sex=='F' }">妹妹</c:if>
								<c:if test="${b.sex=='M' }">哥哥</c:if>
							<br />
						</c:if>
					</c:forEach>
					<div class="clear"></div>
				</div>
				<c:if test="${not empty adList }">
					<div class="weiboAD">
						<c:forEach items="${adList }" var="ad">
						<a><img src="${ad.picture }" width="200px" height="70px" title="${ad.title }"/></a>
				        </c:forEach>
					</div>
				</c:if>
				<div class="clear"></div>
				<em class="lt"></em><em class="lb"></em><em class="rt"></em><em class="rb"></em>
			</div>
			<!--hright-->
			<div class="clear"></div>
		</div>
		<!--/content-->
		<%@include file="../common/footer.jsp"%>
		<!--/footer-->
	</div>
	<!--/wraper-->
</body>
</html>
